<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
    
    <meta name="referrer" content="no-referrer-when-downgrade">
    
    <meta name="renderer" content="webkit"/>
    <meta name="force-rendering" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <script>if (/*@cc_on!@*/false || (!!window.MSInputMethodContext && !!document.documentMode)) window.location.href="https://support.dmeng.net/upgrade-your-browser.html?referrer="+encodeURIComponent(window.location.href); </script>
    
    
        <link rel="preload" crossorigin="crossorigin" href="/fonts/roboto/Roboto-Regular.woff2" as="font">
        <link rel="preload" crossorigin="crossorigin" href="/fonts/roboto/Roboto-Bold.woff2" as="font">
    
    
    
        <link rel="shortcut icon" href="/icons/favicon.ico">
    

    
    
        
<link rel="stylesheet" href="/css/mdui.min.v1.0.0.css">

    
    
<link rel="stylesheet" href="/css/main.css">
<link rel="stylesheet" href="/css/iconfont.css">


    
    

    
        <script data-ad-client="ca-" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    












          


    
    
    <title>
        
            HTML | 吴豪阳的数据库
        
    </title>
    
    
<meta name="generator" content="Hexo 5.4.1"></head>
<body class="mdui-drawer-body-left mdui-appbar-with-toolbar mdui-theme-primary-teal mdui-theme-accent-blue">
  
  <header class="mdui-appbar mdui-appbar-fixed">
  <div id="toolbar" class="mdui-toolbar mdui-color-theme">
    <button class="mdui-btn mdui-btn-icon" mdui-drawer="{target: '#sidebar', swipe: true}"><i class="iconfont icon-menu"></i></button>
    <a href="/" class="mdui-typo-headline">吴豪阳的数据库</a>
    <a href="/" class="header-subtitle mdui-typo-headline"></a>
    <div class="mdui-toolbar-spacer"></div>
    <button class="mdui-btn mdui-btn-icon" mdui-dialog="{target: '#search'}" mdui-tooltip="{content: 'search'}"><i class="iconfont icon-search"></i></button>
  </div>
</header>

<div class="mdui-dialog" id="search">
  
    <div class="search-form">
      <input type="search" class="search-form-input" placeholder="请输入关键字" onfocus="listenSearchFunc()">
    </div>
    <div class="search-result" data-resource="/search.xml"></div>
  
</div>

  <aside id="sidebar" class="mdui-drawer">
    <div class="mdui-tab" mdui-tab>
        <a href="#sidebar-tab1" id="sidebartab" class="mdui-ripple mdui-tab-active">站点概览</a>
        <a href="#sidebar-tab2" id="sidebartab" class="mdui-ripple">关于</a>
    </div>

    
    <div id="sidebar-tab1" class="mdui-p-a-1">
        <div class="mdui-list">
            
                
                <a href="/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-home"></i>
                    </div>
                    <div class="mdui-list-item-content">主页</div>
                </a>
            
                
                <a href="/tags/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-bookmark"></i>
                    </div>
                    <div class="mdui-list-item-content">标签</div>
                </a>
            
                
                <a href="/categories/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-folder"></i>
                    </div>
                    <div class="mdui-list-item-content">分类</div>
                </a>
            
                
                <a href="/archives/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-archive"></i>
                    </div>
                    <div class="mdui-list-item-content">归档</div>
                </a>
            
                
                <a href="/tools/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-tools"></i>
                    </div>
                    <div class="mdui-list-item-content">工具箱</div>
                </a>
            
                
                <a href="/about/" class="mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-user"></i>
                    </div>
                    <div class="mdui-list-item-content">关于</div>
                </a>
            
            <div class="mdui-list-item mdui-ripple">
                <div class="mdui-list-item-icon">
                    <i class="iconfont icon-moon"></i>
                </div>
                <div class="mdui-list-item-content">夜间模式</div>
                <label class="mdui-switch" id="darkmode">
                  <input type="checkbox" id="nightmode_switch"/>
                  <i class="mdui-switch-icon"></i>
                </label>
            </div>           
        </div>
    </div>

    
    <div id="sidebar-tab2" class="mdui-p-a-1">
        <div class="sidebar-overview">
            <div class="sidebar-avatar">
                
                    <img src="/icons/avatar.gif"/>
                
            </div>
            <div class="sidebar-author-name">John Doe</div>
            <div class="sidebar-description"></div>
        </div>
        <div class="sidebar-links">
            
                
                <div class="mdui-chip">
                    <span class="mdui-chip-icon"><i class="iconfont icon-mail"></i></span>
                    <a href="mailto:xxx@xxx.com" class="mdui-chip-title">E-Mail</a>
                </div>
            
                
                <div class="mdui-chip">
                    <span class="mdui-chip-icon"><i class="iconfont icon-github"></i></span>
                    <a target="_blank" rel="noopener" href="https://your.url" class="mdui-chip-title">GitHub</a>
                </div>
            
                
                <div class="mdui-chip">
                    <span class="mdui-chip-icon"><i class="iconfont icon-steam"></i></span>
                    <a target="_blank" rel="noopener" href="https://your.url" class="mdui-chip-title">Steam</a>
                </div>
            
                
                <div class="mdui-chip">
                    <span class="mdui-chip-icon"><i class="iconfont icon-weibo"></i></span>
                    <a target="_blank" rel="noopener" href="https://your.url" class="mdui-chip-title">Weibo</a>
                </div>
            
        </div>
        <ul class="mdui-list" mdui-collapse="{accordion: true}">
            <li class="mdui-collapse-item">
                <div class="mdui-collapse-item-header mdui-list-item mdui-ripple">
                    <div class="mdui-list-item-icon">
                        <i class="iconfont icon-link"></i>
                    </div>
                    <div class="mdui-list-item-content">友情链接</div>
                    <div class="mdui-collapse-item-arrow">
                        <i class="mdui-list-item-icon iconfont icon-angle-down"></i>
                    </div>
                </div>
                <ul id="linksList" class="mdui-collapse-item-body mdui-list mdui-list-dense">
                    
                        <a target="_blank" rel="noopener" href="https://garybear.cn/hexo-theme-meadow/" class="mdui-list-item mdui-ripple">
                            Meadow说明文档
                        </a>
                    
                </ul>
            </li>
        </ul>
    </div>

    <div class="mdui-divider"></div>
    
    
</aside>
  
  <main id="main-contain" class="mdui-container mdui-m-t-5">
    <article id="article" class="mdui-card mdui-p-b-2 mdui-m-b-5">
  <header class="mdui-card-media">
    
    
      <div class="post-header"> 
  <a class="post-header-title" href="/2022/02/21/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/html/">HTML</a>
  <div class="post-header-meta">
    <span>
      <span class="iconfont icon-calendar"></span>
      发布于:&nbsp;2022-02-21
    </span>
    <span>
      <span class="iconfont icon-calendar-check"></span>
      更新于:&nbsp;2022-02-27
    </span>
    <span>
      <span class="iconfont icon-folder"></span>
      分类于:&nbsp;<a class="category-link" href="/categories/%E5%89%8D%E7%AB%AF%E7%99%BE%E7%A7%91/">前端百科</a>
    </span>
    
      <span>
        <span class="iconfont icon-eye"></span>
        阅读次数:&nbsp;
        <span id="busuanzi_container_page_pv"><span id="busuanzi_value_page_pv"></span></span>
      </span>
    
  </div>
</div>   
    



    
    
    <div class="mdui-card-menu">
    
      <button class="mdui-btn mdui-btn-icon mdui-text-color-teal" mdui-menu="{target: '#share_menu', align: 'right'}"><i class="iconfont icon-share"></i></button>
      <ul class="mdui-menu" id="share_menu">
        <li class="mdui-menu-item">
          <a href="http://service.weibo.com/share/share.php?appkey=&title=HTML&url=http://example.com/2022/02/21/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/html/&pic=http://example.com/null&searchPic=false&style=simple" target="_blank" class="mdui-ripple">分享到 Weibo</a>
        </li>
        <li class="mdui-menu-item">
          <a href="https://twitter.com/intent/tweet?text=HTML&url=http://example.com/2022/02/21/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/html/&via=John Doe" target="_blank" class="mdui-ripple">分享到 Twitter</a>
        </li>
        <li class="mdui-menu-item">
          <a href="https://www.facebook.com/sharer/sharer.php?u=http://example.com/2022/02/21/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/html/" target="_blank" class="mdui-ripple">分享到 Facebook</a>
        </li>
        <li class="mdui-menu-item">
          <a href="https://plus.google.com/share?url=http://example.com/2022/02/21/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/html/" target="_blank" class="mdui-ripple">分享到 Google+</a>
        </li>
        <li class="mdui-menu-item">
          <a href="https://www.linkedin.com/shareArticle?mini=true&url=http://example.com/2022/02/21/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/html/&title=HTML" target="_blank" class="mdui-ripple">分享到 LinkedIn</a>
        </li>
        <li class="mdui-menu-item">
          <a href="http://connect.qq.com/widget/shareqq/index.html?site=吴豪阳的数据库&title=HTML&summary=&pics=http://example.com/null&url=http://example.com/2022/02/21/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/html/" target="_blank" class="mdui-ripple">分享到 QQ</a>
        </li>
        <li class="mdui-menu-item">
          <a href="https://telegram.me/share/url?url=http://example.com/2022/02/21/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/html/&text=HTML" target="_blank" class="mdui-ripple">分享到 Telegram</a>
        </li>
      </ul>
    
  </div>
  </header>
  
  
  
  
  <div class="post-tags">
    
      <i class="iconfont icon-tag">
        <a rel="tag" href = /tags/HTML/ >HTML</a>
      </i>
    
  </div>

  
  <div class="mdui-card-content mdui-typo mdui-p-x-4">
    <center> HTML</center>
  &emsp; &emsp; HTML的全称为  超文本标记语言  是一种标记语言。它包括一系列的标签。通过这些表前可以将网络上的<font color=#00ffff>文档格式统一</font>，使分散的internet资源连接为一个逻辑整体。HTML文本是由命令组成的描述性文本，HTML命令可以说明<font color=#00ffff>文字、图形、动画、省心、表格、链接</font>等。<br/>

<p>&emsp; &emsp; <font color=#00ffff>超文本</font>是一种组织信息的方式，它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。这些相互关联的信息媒体可能在同一文本中，也可能是其他文件，或是地理位置相距遥远的某台计算机上的文件。这种组织信息方式将分布在不同的位置的信息资源用随机方式进行连接，为人们查找，检索信息提供方便。</p>
<p>&emsp; &emsp; 由来<br>&emsp; &emsp; HTML的英文全称是 Hyper Text Markup Language，即超文本标记语言。HTML是由Web的发明者 Tim Berners-Lee和同事 Daniel W. Connolly于1990年创立的一种标记语言，它是标准通用化标记语言SGML的应用。用HTML编写的超文本文档称为HTML文档，它能独立于各种操作系统平台(如UNIX， Windows等)。使用HTML，将所需要表达的信息按某种规则写成HTML文件，通过专用的浏览器来识别，并将这些HTML文件“翻译”成可以识别的信息，即现在所见到的网页。 [2]<br>&emsp; &emsp; 自1990年以来，HTML就一直被用作万维网的信息表示语言，使用HTML描述的文件需要通过web浏览器显示出效果。HTML是一种建立网页文件的语言，通过标记式的指令(Tag)，将影像、声音、图片、文字动画、影视等内容显示出来。事实上，每一个HTML文档都是一种静态的网页文件，这个文件里面包含了HTML指令代码，这些指令代码并不是一种程序语言，只是一种排版网页中资料显示位置的标记结构语言，易学易懂，非常简单。HTML的普遍应用就是带来了超文本的技术―通过单击鼠标从一个主题跳转到另一个主题，从一个页面跳转到另一个页面，与世界各地主机的文件链接超文本传输协议规定了浏览器在运行HTML文档时所遵循的规则和进行的操作。HTTP的制定使浏览器在运行超文本时有了统一的规则和标准。 [2]<br>&emsp; &emsp; 万维网（world wide web，简称www）上的一个超媒体文档称之为一个页面（外语：page）。作为一个组织或者个人在万维网上放置开始点的页面称为主页（外语：Homepage）或首页，主页中通常包括有指向其他相关页面或其他节点的指针（超级链接），所谓超级链接，就是一种统一资源定位器（Uniform Resource Locator，外语缩写：URL）指针，通过激活（点击）它，可使浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一。在逻辑上将视为一个整体的一系列页面的有机集合称为网站（Website或Site）。超文本标记语言（英文缩写：HTML）是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。 [3]<br>&emsp; &emsp; 网页的本质就是超文本标记语言，通过结合使用其他的Web技术（如：脚本语言、公共网关接口、组件等），可以创造出功能强大的网页。因而，超文本标记语言是万维网（Web）编程的基础，也就是说万维网是建立在超文本基础之上的。超文本标记语言之所以称为超文本标记语言，是因为文本中包含了所谓“超级链接”点。 [4]<br>定义<br>&emsp; &emsp; 超文本标记语言是标准通用标记语言下的一个应用，也是一种规范，一种标准，它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件，通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容（如：文字如何处理，画面如何安排，图片如何显示等）。浏览器按顺序阅读网页文件，然后根据标记符解释和显示其标记的内容，对书写出错的标记将不指出其错误，且不停止其解释执行过程，编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是，对于不同的浏览器，对同一标记符可能会有不完全相同的解释，因而可能会有不同的显示效果。 [3]<br>&emsp; &emsp;<br>HTML是用来标记Web信息如何展示以及其他特性的一种语法规则，它最初于1989年由CERN的Tim Berners-Lee发明。HTML基于更古老一些的语言SGML定义，并简化了其中的语言元素。这些元素用于告诉浏览器如何在用户的屏幕上展示数据，所以很早就得到各个Web浏览器厂商的支持。 [5]<br>&emsp; &emsp; HTML历史上有如下版本： [5]<br>①HTML 1.0：在1993年6月作为互联网工程工作小组(IETF)工作草案发布。 [5]<br>②HTML 2.0：1995年1 1月作为RFC 1866发布，于2000年6月发布之后被宣布已经过时。 [5]<br>③HTML 3.2：1997年1月14日，W3C推荐标准。 [5]<br>④HTML 4.0：1997年12月18日，W3C推荐标准。 [5]<br>⑤HTML 4.01（微小改进）：1999年12月24日，W3C推荐标准。 [5]<br>⑥HTML 5：HTML5是公认的下一代Web语言，极大地提升了Web在富媒体、富内容和富应用等方面的能力，被喻为终将改变移动互联网的重要推手。Internet Explorer 8及以前的版本不支持。 [6]<br>&emsp; &emsp; HTML在Web迅猛发展的过程中起着重要作用，有着重要的地位。但随着网络应用的深入，特别是电子商务的应用，HTML过于简单的缺陷很快凸现出来：HTML不可扩展。HTML不允许应用程序开发者为具体的应用环境定义自定义的标记。HTML只能用于信息显示。HTML可以设置文本和图片显示方式，但没有语义结构，即HTML显示数据是按照布局而非语义的。随着网络应用的发展，各行业对信息有着不同的需求，这些不同类型的信息未必都是以网页的形式显示出来。例如，当通过搜索引擎进行数据搜索时，按照语义而非按照布局来显示数据会具有更多的优点。<br>总而言之，HTML的缺点使其交互性差，语义模糊，这些缺陷难以适应Internet飞速发展的要求，因此一个标准、简洁、结构严谨以及可高度扩展的XML就产生了。</p>
<p>&emsp; &emsp; 超文本标记语言文档制作不是很复杂，但功能强大，支持不同数据格式的文件镶入，这也是万维网（WWW）盛行的原因之一，其主要特点如下： [4]<br>简易性：超文本标记语言版本升级采用超集方式，从而更加灵活方便。 [4]<br>可扩展性：超文本标记语言的广泛应用带来了加强功能，增加标识符等要求，超文本标记语言采取子类元素的方式，为系统扩展带来保证。 [4]<br>平台无关性：虽然个人计算机大行其道，但使用MAC等其他机器的大有人在，超文本标记语言可以使用在广泛的平台上，这也是万维网（WWW）盛行的另一个原因。 [4]<br>通用性：另外，HTML是网络的通用语言，一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的电脑或浏览器。 [4] </p>
<p>&emsp; &emsp; HTML其实是文本，它需要浏览器的解释，它的编辑器大体可以分为以下几种：<br>基本文本、文档编辑软件，使用微软自带的记事本或写字板都可以编写，当然，如果你用WPS或Word来编写也可以，不过保存时请使用.htm或.html作为扩展名，这样就方便浏览器认出直接解释执行了。 [7]<br>半所见即所得软件，如：FCK-Editer、E-webediter等在线网页编辑器；尤其推荐：Sublime Text代码编辑器（由Jon Skinner开发，Sublime Text2收费但可以无限期试用）。 [7]<br>所见即所得软件，使用最广泛的编辑器，完全可以一点不懂HTML的知识就可以做出网页，如：AMAYA（出品单位：万维网联盟）；FRONTPAGE（出品单位：微软）；Dreamweaver（出品单位Adobe）。Microsoft Visual Studio（出品公司：微软）：其中所见即所得软件与半所见即所得的软件相比，开发速度更快，效率更高，且直观的表现更强。任何地方进行修改只需要刷新即可显示。缺点是生成的代码结构复杂，不利于大型网站的多人协作和精准定位等高级功能的实现。 [7]<br>字符集<br>字符集<br>字符集<br>除了常见的ASCII字符和汉字，HTML还有许多特殊字符，它们一起构成了HTML字符集。有2种情况需要使用特殊字符，一是网页中有其特殊意义的字符，二是键盘上没有的字符。HTML字符可以用一些代码来表示，代码可以有2种表示方式。即字符代码（命名实体）和数字代码（编号实体）。字符代码以“&amp;”符开始，以分号”; “结束，其间是字符名，如&reg; 。数字代码也以“&amp;#”符开始，以分号”; “结束，其间是编号，<br>&emsp; &emsp; 超文本标记语言定义了多种数据类型的元素内容，如脚本数据和样式表的数据，和众多类型的属性值，包括ID、名称、URI、数字、长度单位、语言、媒体描述符、颜色、字符编码、日期和时间等。所有这些数据类型都是专业的字符数据。 [9]<br>常见实体<br>显示结果<br>描述<br>实体名称<br>实体编号</p>
<p>空格<br>&nbsp; </p>
<p>&lt;<br>小于号<br>&lt;<br>&lt;</p>
<blockquote>
</blockquote>
<p>大于号<br>&gt; </p>
<blockquote>
</blockquote>
<p>&amp;<br>和号<br>&amp;<br>&amp;<br>“<br>引号<br>&quot;<br>“<br>‘<br>撇号<br>&apos; (IE不支持)<br>‘<br>￠<br>分<br>&cent;<br>¢<br>￡<br>镑<br>&pound;<br>£<br>￥<br>日元<br>&yen;<br>¥<br>€<br>欧元<br>&euro;<br>€<br>§<br>小节<br>&sect;<br>§<br>©<br>版权<br>&copy;<br>©<br>®<br>注册商标<br>&reg;<br>®<br>™<br>商标<br>&trade;<br>™<br>×<br>乘号<br>&times;<br>×<br>÷<br>除号<br>&divide;<br>÷<br>整体结构编辑 播报<br>一个网页对应多个HTML文件，超文本标记语言文件以.htm或.html（外语缩写）为扩展名(其中.htm是因为之前的文件系统只支持最多三位扩展名)。可以使用任何能够生成TXT类型源文件的文本编辑器来产生超文本标记语言文件，只用修改文件后缀即可。标准的超文本标记语言文件都具有一个基本的整体结构，标记一般都是成对出现（部分标记除外例如：<br/> <img/>），即超文本标记语言文件的开头与结尾标志和超文本标记语言的头部与实体两大部分。有三个双标记符用于页面整体结构的确认。 [10]<br>部分标记也可以不成对出现，如<p>，但是一般并不赞同这样做。<br>标记符<html>，说明该文件是用超文本标记语言来描述的，它是文件的开头; 而</html>，则表示该文件的结尾，它们是超文本标记语言文件的开始标记和结尾标记。 [10]<br>头部内容<br>标记符<html>：说明该文件是用超文本标记语言来描述的，它是文件的开头，而</html>则表示该文件的结尾，它们是超文本标记语言文件的开始标记和结尾标记。 [10] </p>
<head></head>：这2个标记符分别表示头部信息的开始和结尾。头部中包含的标记是页面的标题、序言、说明等内容，它本身不作为内容来显示，但影响网页显示的效果。头部中最常用的标记符是标题标记符和meta标记符，其中标题标记符用于定义网页的标题，它的内容显示在网页窗口的标题栏中，网页标题可被浏览器用做书签和收藏清单。 [10] 
以下表格列出了 HTML head 元素：
标签
描述
<head>
定义了文档的信息
<title>
定义了文档的标题
<base>
定义了页面链接标签的默认链接地址
<link>
定义了一个文档和外部资源之间的关系
<meta>
定义了HTML文档中的元数据
<script>
定义了客户端的脚本文件
<style>
定义了HTML文档的样式文件
主体内容
<body><body/>；，网页中显示的实际内容均包含在这2个正文标记符之间。正文标记符又称为实体标记。 [10] 
标题：总共有6个等级，定义方法如下
<h1><h1/>定义一级标题
<h2><h2/>定义二级标题
<h3><h3/>定义三级标题
<h4><h4/>定义四级标题
<h5><h5/>定义五级标题
<h6><h6/>定义六级标题
以此类推
文本
<p><p/>定义文本
换行符
<br/>换行符

<p>相关要求编辑 播报<br>在编辑超文本标记语言文件和使用有关标记符时有一些约定或默认的要求。 [9]<br>文本标记语言源程序的文件扩展名默认使用htm（磁盘操作系统DOS限制的外语缩写为扩展名）或html（外语缩写为扩展名），以便于操作系统或程序辨认，除自定义的汉字扩展名。在使用文本编辑器时，注意修改扩展名。而常用的图像文件的扩展名为gif和jpg。 [9]<br>超文本标记语言源程序为文本文件，其列宽可不受限制，即多个标记可写成一行，甚至整个文件可写成一行；若写成多行，浏览器一般忽略文件中的回车符（标记指定除外）；对文件中的空格通常也不按源程序中的效果显示。完整的空格可使用特殊符号（实体符）“&amp;nbsp（注意此字母必须小写，方可空格）”表示非换行空格；表示文件路径时使用符号“/”分隔，文件名及路径描述可用双引号也可不用引号括起。 [9]<br>标记符中的标记元素用尖括号括起来，带斜杠的元素表示该标记说明结束；大多数标记符必须成对使用，以表示作用的起始和结束；标记元素忽略大小写，即其作用相同，但完整的空格可使用特殊符号“&amp;nbsp（注意此字母必须小写，方可空格）”；许多标记元素具有属性说明，可用参数对元素作进一步的限定，多个参数或属性项说明次序不限，其间用空格分隔即可；一个标记元素的内容可以写成多行。 [9]<br>标记符号，包括尖括号、标记元素、属性项等必须使用半角的西文字符，而不能使用全角字符。 [9]<br>HTML注释由”<!--"号开始，由符号”-->“结束，例如<!--注释内容-->。注释内容可插入文本中任何位置。任何标记若在其最前插入感叹号，即被标识为注释，不予显示。 [9]</p>

  </div>
  <!--文末结束语-->
  
    <div style="text-align:center;color: #ccc;font-size:24px;"> --- 本文结束 <i class="iconfont icon-heartbeat" style="font-size:24px;"></i> The End --- </div>
  
  <!--页脚广告-->
  
  <div class="mdui-divider"></div>
  
  <nav>
    
      <a rel="prev" class="post-nav-item mdui-float-left" href="/2022/02/21/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/css3/">
        <i class="iconfont icon-angle-left"></i>
        <span>css3</span>
      </a>
    
    
      <a rel="next" class="post-nav-item mdui-float-right" href="/2022/02/21/git%E4%BB%93%E5%BA%93%E7%9A%84%E5%88%9B%E5%BB%BA/git%E6%8C%87%E4%BB%A4/">
        <span>git 仓库的指令</span>
        <i class="iconfont icon-angle-right"></i>
      </a>
    
  </nav>
</article>




  <div class="toc-button"  style="z-index: 100;">
    <button class="mdui-fab mdui-ripple mdui-color-teal" mdui-menu="{target: '#toc'}"><i class="iconfont icon-list"></i></button>
    <ul class="mdui-menu" id="toc">
      <li class="mdui-menu-item">
        <a href="/2022/02/21/%E8%A1%8C%E4%B8%9A%E6%8A%A5%E5%91%8A/html/" id="toc-header" class="mdui-ripple">文章目录</a>
        
      </li>
    </ul>
  </div>



    <div id="comment" class="mdui-card mdui-p-a-2 mdui-m-b-5">
      <div class="mdui-tab" mdui-tab>
        
          <a href="#comment-tab0" class="mdui-ripple">gitalk</a>
        
          <a href="#comment-tab1" class="mdui-ripple">livere</a>
        
      </div>
      
        <div id="comment-tab0" class="mdui-p-a-2">
          <div id="gitalk-container"></div>
<link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">
<script src="https://unpkg.com/gitalk/dist/gitalk.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/js-md5@0.7.3/src/md5.min.js"></script>
<script>
  var gitalk = new Gitalk({
    clientID: '',
    clientSecret: '',
    repo: '',
    owner: '',
    admin: [''],
    id:  md5(location.pathname) ,
    distractionFreeMode: 'true',
  });
  gitalk.render('gitalk-container');
</script>
        </div>
      
        <div id="comment-tab1" class="mdui-p-a-2">
          <div id="lv-container" data-id="city" data-uid="">
  <script type="text/javascript">
    (function (d, s) {
      var j, e = d.getElementsByTagName(s)[0];
      if (typeof LivereTower === 'function') { return; }
      j = d.createElement(s);
      j.src = 'https://cdn-city.livere.com/js/embed.dist.js';
      j.async = true;
      e.parentNode.insertBefore(j, e);
    })(document, 'script');
  </script>
  <noscript>Please enable JavaScript to view the comments powered by LiveRe.</noscript>
</div>
        </div>
      
    </div>

  </main>
  <footer id="footer" class="mdui-text-center mdui-m-t-5 mdui-p-b-2 mdui-p-t-4 mdui-color-theme">
  <div class="mdui-container">
    <div class="mdui-row">
      
        <a href="https://beian.miit.gov.cn" rel="noopener" target="_blank"></a>
      
      <span>
        &copy; 2015 - 2022 
        
          <span style="color:#d9333f" class="iconfont icon-heart"></span>
        
        John Doe
      </span>
    </div>
    <div class="mdui-row">
      
        <div class="mdui-col-xs-6 mdui-text-right">
          <span>Powered by <a href="https://hexo.io/" rel="noopener" target="_blank">Hexo</a></span>
        </div>
        <div class="mdui-col-xs-6 mdui-text-left">
          <span>Theme: <a href="https://github.com/kb1000fx/Meadow" rel="noopener" target="_blank">Meadow</a></span>
        </div>
      
    </div>
    <div class="mdui-row">
      
        <div class="mdui-col-xs-6 mdui-text-right">
          <span id="busuanzi_container_site_uv" style="display: none;"> <span class="iconfont icon-user"></span>总访客量 <span id="busuanzi_value_site_uv"></span></span>
        </div>
        <div class="mdui-col-xs-6 mdui-text-left">
          <span id="busuanzi_container_site_pv" style="display: none;"> <span class="iconfont icon-eye"></span>总访问量 <span id="busuanzi_value_site_pv"></span></span>
        </div>
      
    </div>
 </div>
</footer>
  
  <button id="gotop" class="mdui-fab mdui-fab-fixed mdui-fab-hide mdui-ripple mdui-color-teal" style="z-index:100;"><i class="iconfont icon-arrowup"></i></button>
  
  

    <script async src="https://busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>




    <script src="https://cdn.jsdelivr.net/npm/mermaid@8.4.8/dist/mermaid.min.js"></script>
    <script>mermaid.initialize({
        startOnLoad: true,
        theme: "default"
    });</script>




    
<script src="/js/mdui.min.v1.0.0.js"></script>




<script src="/js/meadow.js"></script>

</body>
</html >